<template>
  <div class="container h100">
    <editPageNew
      ref="editPage"
      :rightBtnArr="rightBtnArr"
      :stepConfig="stepConfig"
      :creatInfo="creatInfo"
      :moreBtnArr="moreBtnArr"
      :showMore="true"
      showTopTitle
    >
      <template slot="editPageTitle">
        <i class="el-icon-document TitleImg"></i>
        {{ title }}
      </template>
      <div class="plan-title">
        <div v-show="!showInput" class="name">
          <span style="color: red"></span>
          <span>{{ titleName }}</span>
          <el-link
            style="font-size: 20px"
            icon="el-icon-edit-outline"
            @click="editTitle"
          ></el-link>
        </div>
        <div v-show="showInput" class="name-input">
          <!-- <label>参数组名称</label> -->
          <el-input
            type="text"
            maxlength="64"
            show-word-limit
            v-model.trim="titleName"
            @blur="loseFocus"
            placeholder="请输入标题"
            clearable
            ref="mark"
            ><template slot="prepend" style="color: red">标题</template>
          </el-input>
        </div>
      </div>
      <el-collapse v-model="activeNames" style="padding-right: 10px">
        <el-collapse-item name="basic">
          <template slot="title">
            <span class="titleLine"></span>
            基本信息
          </template>
          <editForm
            :formConfig="basicConfig"
            ref="basicForm"
            :formData="formData"
          >
          </editForm>
          <stepList
            :formListData="stepListData"
            ref="stepList"
            :isReadonly="isReadonly"
            :status="status"
            :ticketId="ticketId"
          ></stepList>
        </el-collapse-item>
        <el-collapse-item name="execute" v-if="[2, 3, -1].includes(status)">
          <template slot="title">
            <span class="titleLine"></span>
            执行信息
          </template>
          <editForm
            :formConfig="executeConfig"
            ref="executeForm"
            :formData="formData"
          >
          </editForm>
          <div class="upload-file">
            <span>附件：</span>
            <attach-form
              style="width: 60%"
              :filesList="filesList"
              :limit="10"
              :disabled="false"
              ref="attachForm"
            >
            </attach-form>
          </div>
        </el-collapse-item>
        <el-collapse-item name="safe" v-if="hideWorkTicket">
          <template slot="title">
            <span class="titleLine"></span>
            安全措施项
          </template>
          <component :is="securityContent" :security="security"></component>
        </el-collapse-item>
      </el-collapse>
    </editPageNew>
    <!-- 校验签名弹出层 -->
    <verifyDialog
      :verifyDialogConfig="verifyDialog"
      v-if="verifyDialog.showVerify"
      ref="verifyDialog"
    ></verifyDialog>
    <signature
      v-if="showSignature"
      @doSign="doSign"
      :showSignature.sync="showSignature"
    ></signature>
    <remarkOrCheck
      v-if="showRemarks"
      :workTicketId="ticketId"
      :dialogTitle="dialogTitle"
      ticketType="operation"
      ref="remarkOrCheck"
    ></remarkOrCheck>
  </div>
</template>
<script>
import stepList from "./stepList";
import verifyDialog from "./verifyDialog";
import signature from "@/components/signature";
import remarkOrCheck from "../../workTicket/workTicketProcessing/process/remarkOrCheck";
import electricalTable from "./securityComponents/electricalTable";
import textareaComponent from "./securityComponents/textareaComponent";
import {
  operationTicketDetail,
  saveTicket,
  deleteTicket,
  printTicket,
  toApprove,
  sampleTicketDetail,
  getWorkTicketDataById,
} from "@/api/twoTicketManagement/operationTicket.js";
import {
  getWorkTicketInfo,
  getWorkTicketData,
} from "@/api/twoTicketManagement/workTicket.js";
import {
  getAttachList, //附件列表获取
} from "@/api/common";
export default {
  components: {
    stepList,
    verifyDialog,
    signature,
    electricalTable,
    textareaComponent,
    remarkOrCheck,
  },
  data() {
    return {
      creatInfo: {},
      title: "", //一级标题
      titleName: "", //二级标题
      pageType: "",
      executeId: "",
      stepConfig: {},
      status: 0, //当前审核状态
      items: ["未审核", "已自审", "已生成", "已归档"], //审核步骤
      ticketId: "",
      showRemarks: false, // 备注弹框
      dialogTitle: "", // 弹框标题
      //打印操作票的地址
      printSrc: "",

      formData: null,
      stepListData: [], //操作步骤数据
      isReadonly: false, //操作步骤设置只读
      showInput: false,
      curClickBtn: "", //记录点击的按键
      activeNames: ["basic", "safe", "execute"],
      //安全措施项
      securityContent: null,
      hideWorkTicket: true, //当选择无工作票对应操作票时隐藏工作票票号，默认显示工作票票号
      workIds: [], //工作票ID和code
      security: {
        listData: [],
      },

      moreBtnArr: [
        {
          text: "打印",
          // icon: "el-icon-printer",
          methods: async () => {
            let res = await printTicket({ id: this.ticketId, type: 1 });
            const path =
              res.data +
              `&token=${localStorage.getItem("GDH_WATER_TOKEN") ||
                process.env
                  .VUE_APP_TOKEN}&dynamicDataSource=${localStorage.getItem(
                "currDs"
              )}&dynamicOrg=${localStorage.getItem(
                "currOrg"
              )}&dynamicLeader=${localStorage.getItem(
                "currLeader"
              )}&dynamicLeaderOrg=${localStorage.getItem("currLeaderOrg")}`;
            if (res.code === 200) {
              this.$utils.isInstallPrintSoftware(path);
            }
          },
        },
      ],
      //基本信息配置
      basicConfig: {
        labelWidth: "140px",
        itemArr: [
          {
            label: "操作票类型：",
            prop: "group",
            type: "select",
            required: true,
            disabled: true,
            span: 8,
            selectOption: this.$store.getters["dirtData"](
              "ticket_operation_group"
            ),
          },
          {
            label: "操作票子类：",
            prop: "type",
            type: "select",
            required: true,
            span: 8,
            selectOption: this.$store.getters["dirtData"](
              "ticket_operation_type"
            ),
            methods: (val) => {
              const wcode = this.$refs.basicForm.getFormItem("workCodeSplit");
              // 自动填写操作任务
              if (wcode) {
                if (val.value === "operation_a") {
                  this.$refs.basicForm.setFormItem(
                    "context",
                    `布置${wcode}号工作票的安全措施`
                  );
                  this.titleName = `布置${wcode}号工作票的安全措施`;
                }
                if (val.value === "operation_b") {
                  this.$refs.basicForm.setFormItem(
                    "context",
                    `解除${wcode}号工作票的安全措施`
                  );
                  this.titleName = `解除${wcode}号工作票的安全措施`;
                }
              }

              if (val.value === "operation_no_work") {
                this.hideWorkTicket = false;
                const { itemArr } = this.basicConfig;
                //隐藏工作票号
                const arr = itemArr.filter(
                  (item) => item.type !== "workTicket"
                );
                this.basicConfig.itemArr = arr;
                //清除工作票号的值
                if (this.formData) {
                  this.formData.workCodeSplit = "";
                  this.formData.type = "operation_no_work";
                  this.formData.workIds = null;
                }
                this.workIds = [];
              } else {
                this.hideWorkTicket = true;
                if (this.basicConfig.itemArr[2].prop !== "workCodeSplit") {
                  this.basicConfig.itemArr.splice(2, 0, {
                    label: "工作票票号：",
                    prop: "workCodeSplit",
                    type: "workTicket",
                    placeholder: "请选择工作票票号",
                    required: true,
                    span: 8,
                    methods: async (val) => {
                      //自动填写操作任务
                      const { id, code } = val;
                      this.workIds = [{ workId: id, workCode: code }];
                      this.setSecurity(id);

                      const formdata = this.$refs.basicForm.getCurrentData();
                      const formtype = formdata.type;
                      if (
                        formtype === "operation_a" ||
                        formtype === "operation_b"
                      ) {
                        if (formtype === "operation_a") {
                          this.$refs.basicForm.setFormItem(
                            "context",
                            `布置${code}号工作票的安全措施`
                          );
                          this.titleName = `布置${code}号工作票的安全措施`;
                        }
                        if (formtype === "operation_b") {
                          this.$refs.basicForm.setFormItem(
                            "context",
                            `解除${code}号工作票的安全措施`
                          );
                          this.titleName = `解除${code}号工作票的安全措施`;
                        }
                      } else {
                        // this.$refs.basicForm.setFormItem(
                        //   "context",
                        //   `布置${code}号工作票的安全措施`
                        // );
                      }
                    },
                  });
                }
              }
            },
          },
          {
            label: "工作票票号：",
            prop: "workCodeSplit",
            type: "workTicket",
            // type: "text",
            placeholder: "请选择工作票票号",
            required: true,
            span: 8,
            methods: async (val) => {
              //自动填写操作任务
              const { id, code } = val;
              this.workIds = [{ workId: id, workCode: code }];
              this.setSecurity(id);

              const formdata = this.$refs.basicForm.getCurrentData();
              const formtype = formdata.type;
              if (formtype === "operation_a" || formtype === "operation_b") {
                if (formtype === "operation_a") {
                  this.$refs.basicForm.setFormItem(
                    "context",
                    `布置${code}号工作票的安全措施`
                  );
                  this.titleName = `布置${code}号工作票的安全措施`;
                }
                if (formtype === "operation_b") {
                  this.$refs.basicForm.setFormItem(
                    "context",
                    `解除${code}号工作票的安全措施`
                  );
                  this.titleName = `解除${code}号工作票的安全措施`;
                }
              } else {
                // this.$refs.basicForm.setFormItem(
                //   "context",
                //   `布置${code}号工作票的安全措施`
                // );
              }
            },
          },
          {
            label: "发令人：",
            prop: "irritatingName",
            propArr: "irritatingNameArr",
            idsStr: "irritating",
            type: "user-select",
            placeholder: "请选择发令人",
            allowCreate: false, //是否允许创建条目
            multiple: false, //是否多选
            isOutOrg: 0, //是否是外单位
            required: true,
            span: 8,
            option: [],
            trigger: "change",
            methods: () => {},
          },
          {
            label: "受令人：",
            prop: "operationuser",
            propArr: "operationuserArr",
            idsStr: "operationuserId",
            orgStr: "OrgStr",
            orgNameStr: "OrgName",
            orgIdStr: "OrgId",
            type: "user-select",
            placeholder: "请选择受令人",
            allowCreate: true,
            option: [],
            multiple: true,
            required: true,
            disabled: false,
            isHide: false,
            span: 8,
            rows: 2,
            methods: (data) => {
              let operationuserlist = data.map((item) => {
                const obj = {
                  account: item.id,
                  userName: item.name,
                  deptid: item.orgId,
                  deptName: item.orgName,
                  operationId: this.id ? this.id : "",
                };
                return obj;
              });
              this.$refs.basicForm.setFormItem(
                "operationuserlist",
                operationuserlist
              );
            },
          },

          {
            label: "发令时间：",
            prop: "command",
            type: "datetime",
            required: true,
            span: 8,
          },
          {
            label: "操作任务：",
            prop: "context",
            type: "textarea",
            maxlength: "1000",
            rows: 4,
            required: false,
            span: 24,
          },
        ],
      },
      executeConfig: {
        labelWidth: "140px",
        actionList: [
          {
            name: "上传",
            icon: "el-icon-plus",
            method: (row) => {
              this.toUpload();
            },
          },
          {
            name: "删除",
            icon: "el-icon-delete",
            method: (row) => {
              this.delete();
            },
          },
        ],
        itemArr: [
          {
            label: "操作开始时间：",
            prop: "startTime",
            type: "datetime",
          },
          {
            label: "操作截止时间：",
            prop: "endTime",
            type: "datetime",
          },
          {
            label: "操作人：",
            prop: "workerName",
            type: "text",
            required: true,
            disabled: true,
            span: 8,
          },
          {
            label: "监护人：",
            prop: "guardianName",
            type: "text",
            required: true,
            disabled: true,
            span: 8,
          },
          {
            label: "值班负责人：",
            prop: "dutyManName",
            type: "text",
            required: true,
            disabled: true,
            span: 8,
          },
          {
            label: "备注：",
            prop: "desc",
            type: "textarea",
            maxlength: "1000",
            rows: 4,
            required: false,
            span: 24,
          },
        ],
      },
      //签名弹窗配置
      checker: "",
      checkerName: "",
      showSignature: false,
      verifyDialog: {
        title: "", //弹窗标题
        nowStatus: 1,
        showVerify: false, //是否显示
        formId: "", //当前表单ID
        submitType: 1, //提交类型--通过、不通过
        //签名确认
        submit: async () => {
          let {
            code,
            description,
          } = await this.$refs.verifyDialog.checkVerify();
          if (code === 200) {
            this.$message.success(description);
            this.$utils.addOperateLog(this.ticketId, `复审了${this.title}`);
            this.init();
          }
        },
        //关闭弹窗
        cancel: () => {
          this.verifyDialog.showVerify = false;
        },
      },
      filesList: [],
    };
  },
  created() {
    this.init();
  },

  methods: {
    //初始化页面数据
    async init() {
      this.pageType = this.$route.query.pageType;

      //判断是新增页面
      if (this.pageType == "add") {
        this.title = "电气倒闸操作票";
        this.showInput = true;
        //设置操作步骤数据
        this.stepListData = [
          {
            rowNum: "1",
            item: "",
            marks: null,
            remarks: null,
          },
        ];
        setTimeout(() => {
          this.$refs.basicForm.setFormItem("group", "factory");
        }, 0);
      } else if (this.pageType == "simpleImport") {
        let data = await sampleTicketDetail(this.$route.query.id);
        this.formData = JSON.parse(JSON.stringify(data.data));
        this.status = 0;
        this.title = "电气倒闸操作票 ";

        //设置标题
        if (!this.formData.title) {
          if (this.formData.type === "operation_a") {
            this.titleName =
              "布置" + this.formData.workCodeSplit + "号工作票的安全措施";
          }

          if (this.formData.type === "operation_b") {
            this.titleName =
              "解除" + this.formData.workCodeSplit + "号工作票的安全措施";
          }

          if (this.formData.type === "operation_no_work") {
            this.titleName = this.formData.context;
          }
          this.formData.title = this.titleName;
          await saveTicket(this.formData);
        } else {
          this.titleName = this.formData.title;
        }
        //设置操作步骤数据
        this.stepListData = this.formData.stepdet.map((obj) => {
          return {
            rowNum: obj.sort,
            item: obj.item,
            marks: obj.marks,
            remarks: obj.remarks,
          };
        });
      } else if (this.pageType == "workTicket") {
        let data = await getWorkTicketDataById(this.$route.query.id);
        const { workTicket } = data.data;
        const { code, id } = workTicket;

        this.title = "电气倒闸操作票 ";
        //设置操作步骤数据
        this.stepListData = [
          {
            rowNum: "1",
            item: "",
            marks: null,
            remarks: null,
          },
        ];
        this.$nextTick(() => {
          this.$refs.basicForm.setFormItem("group", "factory");
          this.$refs.basicForm.setFormItem("workCodeSplit", code);
          this.workIds = [{ workId: id, workCode: code }];
        });
        this.setSecurity(id);
      } else {
        this.curClickBtn != "selfAppro" &&
          (this.ticketId = this.$route.query.id);
        this.pageType != "addImport" &&
          this.moreBtnArr.splice(1, 1, {
            text: "操作记录",
            methods: () => {
              this.$refs.editPage.showOperate();
            },
          });
        let { data } = await operationTicketDetail({ id: this.ticketId });
        //回显发令人信息
        const { irritatingName, irritating, operationuserlist } = data;
        data.irritatingNameArr = irritatingName;
        let irr = [
          {
            id: irritating,
            name: irritatingName,
            label: irritatingName,
            value: irritating,
          },
        ];
        this.$refs.basicForm.setItemOption("irritatingName", irr);

        // 回显受令人
        let operationuserName = operationuserlist
          .map((item) => item.userName)
          .join(",");
        let operationuserId = operationuserlist
          .map((item) => item.account)
          .join(",");
        let operationuserArr = operationuserlist.map((item) => {
          return `${item.account}${item.deptid}`;
        });
        data.operationuser = operationuserName;
        data.operationuserId = operationuserId;
        data.OrgName = operationuserlist.map((item) => item.deptName).join(",");
        data.OrgId = operationuserlist.map((item) => item.deptid).join(",");
        data.OrgStr = operationuserlist.map((item) => "0").join(",");
        let workerOption = operationuserlist.map((item) => {
          let obj = {
            label: item.userName,
            value: `${item.account}${item.deptid}`,
            id: item.account,
            name: item.userName,
            orgName: item.deptName,
            orgId: item.deptid,
            orgStr: "0",
          };
          return obj;
        });
        setTimeout(() => {
          this.$refs.basicForm.setItemOption("operationuser", workerOption);
          this.$refs.basicForm.setFormItem(
            "operationuserArr",
            operationuserArr
          );
        }, 500);
        this.formData = data;
        this.pageType == "addImport" && delete this.formData.code;
        this.creatInfo = this.formData;
        this.title =
          "电气倒闸操作票 " + (this.formData.code ? this.formData.code : "");
        //历史导入的不需要导入标题
        this.pageType == "addImport" && (this.title = "电气倒闸操作票");
        this.status = this.formData.status;
        if (this.formData.executemsg) {
          this.executeId = this.formData.executemsg.id;
        }
        //判断作废状态
        if (this.status == -1) {
          this.items[3] = "作废";
          this.status = 3;
        }
        //设置标题
        if (!this.formData.title) {
          if (this.formData.type === "operation_a") {
            this.titleName =
              "布置" + this.formData.workCodeSplit + "号工作票的安全措施";
          }

          if (this.formData.type === "operation_b") {
            this.titleName =
              "解除" + this.formData.workCodeSplit + "号工作票的安全措施";
          }

          if (this.formData.type === "operation_no_work") {
            this.titleName = this.formData.context;
          }
          this.formData.title = this.titleName;

          await saveTicket(this.formData);
        } else {
          this.titleName = this.formData.title;
        }
        //设置操作步骤数据
        this.stepListData = this.formData.stepdet.map((obj) => {
          return {
            rowNum: obj.sort,
            item: obj.item,
            marks: obj.marks,
            remarks: obj.remarks,
          };
        });
        setTimeout(() => {
          this.$refs.basicForm.setFormItem(
            "workCode",
            this.formData.workCodeSplit
          );
        }, 0);
        //获取安全措施
        if (this.formData.type === "operation_no_work") {
          this.hideWorkTicket = false;
          const { itemArr } = this.basicConfig;
          //隐藏工作票号
          const arr = itemArr.filter((item) => item.type !== "workTicket");
          this.basicConfig.itemArr = arr;
        } else {
          this.workIds = this.formData.workIds;
          this.activeName = this.workIds[0].workId;
          this.setSecurity(this.workIds[0].workId);
        }
        //设置执行信息
        if (this.formData.executemsg) {
          let {
            workerName,
            guardianName,
            dutyManName,
            desc,
            startTime,
            endTime,
          } = this.formData.executemsg;
          setTimeout(() => {
            this.$refs.executeForm.setFormItem("workerName", workerName || "");
            this.$refs.executeForm.setFormItem(
              "guardianName",
              guardianName || ""
            );
            this.$refs.executeForm.setFormItem(
              "dutyManName",
              dutyManName || ""
            );
            startTime &&
              this.$refs.executeForm.setFormItem("startTime", startTime);
            endTime && this.$refs.executeForm.setFormItem("endTime", endTime);
            this.$refs.executeForm.setFormItem("desc", desc || "");
          }, 0);
          this.getFileList(this.ticketId);
        }
        console.log(this.formData);
      }
      this.stepConfig = {
        nowStep: this.status, //当前步骤，对应stepItem数组的下标，例如：0-步骤一、1-步骤二
        stepItem: this.items,
      };
      //判断是从历史导入
      if (this.pageType !== "addImport") {
        //非新建状态，禁止编辑
        this.status === 0 ? this.editBasicInput() : this.disabledbasicInput();
        [3, -1].includes(this.status) && this.disabledExecuteInput();
      } else {
        this.curClickBtn != "selfAppro" && (this.ticketId = "");
        this.status = 0;
        this.stepConfig = {
          nowStep: this.status,
          stepItem: this.items,
        };
      }
    },
    //获取附件列表
    getFileList(id) {
      getAttachList({ businessId: id }).then((res) => {
        if (res.code == 200) {
          this.filesList = res.data;
        }
      });
    },
    //审批按键
    approve(stepType) {
      if (this.status !== 1) this.showSignature = true;
      if (this.status === 1 && this.curClickBtn === "revoke") {
        this.showSignature = true;
      } else if (this.status === 1 && this.curClickBtn !== "revoke") {
        this.verifyDialog.showVerify = true;
      }
      this.verifyDialog.formId = this.ticketId;
      this.verifyDialog.title = stepType;
      //设置提交是通过、不通过、作废
      if (this.curClickBtn === "selfAppro") this.verifyDialog.submitType = 1;
      if (this.curClickBtn === "revoke") this.verifyDialog.submitType = 2;
      if (this.curClickBtn === "cancellation") this.verifyDialog.submitType = 3;
    },
    async doSign(userInfo) {
      const { account, name } = userInfo;
      if (account) {
        this.checker = account;
        this.checkerName = name;
        //未审核、已生成状态下先保存修改，再走流程
        if (this.status == 0 || this.status == 2) {
          await this.save();
        }
        await this.toApproTicket();
        this.$utils.addOperateLog(
          this.ticketId,
          `${this.verifyDialog.title}了${this.title}`
        );
      }
    },
    //调审批接口
    async toApproTicket() {
      const params = {
        id: this.ticketId,
        submitType: this.verifyDialog.submitType,
        nowStatus: this.status,
      };
      const res = await toApprove(params);
      if (res.code === 200) {
        let data = await operationTicketDetail({ id: this.ticketId });
        this.status = data.data.status;
        this.ticketId = data.data.id;

        this.$router.replace({
          name: "electricTicketDetails",
          query: {
            pageType: "details",
            id: this.ticketId,
            status: this.status,
          },
        });
      }
    },
    //保存按键
    async save() {
      //校验二级标题必填
      if (!this.titleName) {
        this.$message.error("请填写标题！");
        return false;
      }
      let data = await this.$refs.basicForm.getFormData();
      delete data.id;
      delete data.label;
      if (this.ticketId !== "") {
        data.id = this.ticketId;
      }
      data.title = this.titleName;
      //获取签名人
      this.status === 0 && (data.checker = this.checker);
      this.status === 0 && (data.checkerName = this.checkerName);
      //回传安全措施ID
      data.workIds = this.workIds;
      data.status = this.status;
      const stepdet = this.$refs.stepList.listConfig.listData;
      //校验操作步骤至少要有一行数据
      if (stepdet.length == 0) {
        this.$message.error("请填写操作项目！");
        return false;
      }

      //校验操作步骤必填信息
      let hasEmpty = false;
      //新建状态下校验
      this.status === 0 &&
        stepdet.filter((step) => {
          if (hasEmpty) return;
          if (!step.item || step.item.trim() === "") {
            this.$message.error("第" + step.rowNum + "行操作项目不能为空！");
            hasEmpty = true;
            return;
          }
        });
      if (hasEmpty) return;

      data.stepdet = stepdet.map((obj) => {
        const { rowNum, item, marks, remarks } = obj;
        return { sort: rowNum, item, marks, remarks };
      });
      //保存执行信息
      if (this.status === 2) {
        let executemsg = await this.$refs.executeForm.getFormData();
        delete executemsg.label;
        executemsg.id = this.executeId;
        data.executemsg = executemsg;
        this.$refs.attachForm.doSubmitFiles(this.ticketId);
      }
      delete data.createTime;
      delete data.createByName;
      delete data.createBy;
      let res = await saveTicket(data);

      if (res.code === 200) {
        this.ticketId = res.data;
        this.$message.success("数据保存成功！");
        localStorage.setItem("update", Math.floor(Math.random() * 1000) + 1); //设置localStorage里面的值，保证每次都会触发storage事件
        localStorage.setItem("pageType", "detail");
        localStorage.setItem("formData", JSON.stringify({ id: this.ticketId }));
        this.curClickBtn === "save" &&
          this.$utils.addOperateLog(this.ticketId, `保存了${this.title}`);
        this.curClickBtn === "save"
          ? this.$router.replace({
              name: "electricTicketDetails",
              query: {
                pageType: "details",
                id: this.ticketId,
                status: this.status,
              },
            })
          : this.init();
      }
    },
    //删除
    async deleteBtn() {
      this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(async () => {
          let deleteRes = await deleteTicket({ id: this.ticketId });
          if (deleteRes.status === 200) {
            this.$message({
              type: "success",
              message: "删除成功!",
            });
          }
          this.$router.push(
            "/twoTicketManagement/operationTicket/operationTicketProcessing"
          );
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    //禁用基本信息文本框
    disabledbasicInput() {
      //设置基本信息只读
      let setDisabled = this.basicConfig.itemArr.filter((obj) => {
        obj.disabled = true;
        return obj;
      });
      //设置操作步骤只读
      this.isReadonly = true;
      this.$set(this.basicConfig, "itemArr", setDisabled);
    },
    //禁用执行文本框
    disabledExecuteInput() {
      //设置基本信息只读
      let setDisabled = this.executeConfig.itemArr.filter((obj) => {
        obj.disabled = true;
        return obj;
      });
      //设置操作步骤只读
      this.$set(this.executeConfig, "itemArr", setDisabled);
    },
    //基本信息改为可编辑
    async editBasicInput() {
      //从生成撤回的不允许修改操作票子类
      let flag = false;
      if (this.ticketId) {
        const res = await this.$refs.editPage?.getOperateInfo(this.ticketId);
        if (res) {
          for (let i = 0; i < res.data.length; i++) {
            const obj = res.data[i];
            obj.content.indexOf("复审") !== -1 && (flag = true);
          }
        }
      }
      //设置基本信息只读
      let setDisabled = this.basicConfig.itemArr.filter((obj) => {
        if (obj.prop !== "group") obj.disabled = false;
        obj.prop === "type" && flag && (obj.disabled = true);
        obj.prop === "workCodeSplit" && flag && (obj.disabled = true);
        return obj;
      });
      //设置操作步骤只读
      this.isReadonly = false;
      this.$set(this.basicConfig, "itemArr", setDisabled);
    },
    //编辑标题
    editTitle() {
      this.showInput = true;
      setTimeout(() => {
        this.$refs.mark.focus();
      }, 0);
    },
    //标题输入框失去焦点
    loseFocus() {
      if (this.titleName != "") {
        this.showInput = false;
      } else {
        this.$message.warning("标题不能为空");
      }
    },
    //设置td样式
    tableCellStyle() {
      return {
        "border-bottom": "1px solid #ebebeb",
        padding: "5px 0!important",
      };
    },
    //获取安全措施
    async setSecurity(tid) {
      const data = { id: tid };
      let res = await getWorkTicketInfo(data);
      const { id, type } = res.data;
      const details = await getWorkTicketData({ id, type });
      const { securityArrangementList, workTicket, workInfo } = details.data;
      [
        "ElectricalFirst",
        "ElectricalSecond",
        "PowerLineFirst",
        "FirstLevelHotWork",
        "SecondLevelHotWork",
      ].includes(workTicket.type) &&
        this.setSecurityTable(securityArrangementList);
      ["ThirdTicket", "MechanicalTicket", "PowerLineSecond"].includes(
        workTicket.type
      ) && this.setSecurityTextarea(workInfo.safetyMeasures);
    },
    //设置安全措施table
    setSecurityTable(listData) {
      this.securityContent = electricalTable;
      this.$set(this.security, "listData", listData);
    },
    //设置安全措施texttare
    setSecurityTextarea(textData) {
      this.securityContent = textareaComponent;
      this.$set(this.security, "listData", textData);
    },
  },
  computed: {
    rightBtnArr() {
      let arr = [
        {
          text: "抽查",
          icon: "el-icon-s-tools",
          hide: this.pageType != "check",
          methods: () => {
            this.showRemarks = true;
            this.dialogTitle = "抽查";
            this.$nextTick(() => {
              this.$refs.remarkOrCheck.showDialog();
            });
          },
        },
        {
          text: "自审",
          icon: "el-icon-top-right",
          hide: this.status !== 0,
          methods: () => {
            this.curClickBtn = "selfAppro";
            this.approve("自审");
          },
        },
        {
          text: "归档",
          icon: "el-icon-top-left",
          hide: this.status !== 2,
          methods: () => {
            this.curClickBtn = "placeFile";
            this.approve("归档");
          },
        },
        {
          text: "保存",
          icon: "icon-baocun",
          hide: [1, 3, -1].includes(this.status),
          methods: () => {
            this.curClickBtn = "save";
            this.save();
          },
        },
        {
          text: "复审",
          icon: "el-icon-top-right",
          hide: this.status !== 1,
          methods: () => {
            this.curClickBtn = "repeat";
            this.approve("复审");
          },
        },
        {
          text: "撤回",
          icon: "el-icon-top-left",
          hide: this.status !== 1 && this.status !== 2,
          methods: () => {
            this.curClickBtn = "revoke";
            this.approve("撤回");
          },
        },

        {
          text: "作废",
          icon: "el-icon-top-left",
          hide: this.status !== 2,
          methods: () => {
            this.curClickBtn = "cancellation";
            this.approve("作废");
          },
        },
        {
          text: "删除",
          icon: "icon-shanchu",
          hide: this.status !== 0,
          methods: () => {
            this.curClickBtn = "del";
            this.deleteBtn("删除");
          },
        },
      ];
      return arr;
    },
  },
};
</script>
<style lang="less" scoped>
.container {
  height: 100%;
  width: 100%;
  overflow: hidden;
  padding: 0px 100px;
  background-color: #ffffff;

  .TitleImg {
    margin-right: 2px;
    font-size: 22px;
  }

  .plan-title {
    height: 40px;
    margin: 0 0 10px 0;

    .name {
      font-size: 18px;
      padding: 0 10px;
      height: 40px;
      font-weight: bold;
      line-height: 40px;
      text-align: left;
      padding: 0 10px;
    }

    .name-input {
      width: 400px;
      height: 40px;
      line-height: 40px;
    }
  }
}

.upload-file {
  margin-left: 88px;
  text-align: left;
  display: flex;

  span {
    margin-right: 10px;
  }
}
</style>